// pages/billstype/billstype.js
import * as echarts from '../../ec-canvas/echarts';
const title_pie = ['收入分类', '支出分类']
const title_line = ['每日收入', '每日支出']
const in_or_sp = ['income', 'spending']
function setFirstOption(chart, xlist, ylist, title) {
	var option1 = {
		title: {
			text: title_line[in_or_sp.indexOf(title)],
			left: 'center'
		},
		color: ["#46A3FF"],
		grid: {
			containLabel: true
		},
		tooltip: {
			show: true,
			trigger: 'axis'
		},
		xAxis: {
			type: 'category',
			boundaryGap: false,
			data: xlist
		},
		yAxis: {
			x: 'center',
			type: 'value',
			splitLine: {
				lineStyle: {
					type: 'dashed'
				}
			},
		},
		series: [{
			name: '日数据',
			type: 'line',
			smooth: false,
			data: ylist
		}]
	};
	chart.setOption(option1);
}
function setSecondOption(chart, frequency, title) {
	var option2 = {
		title: {
			text: title_pie[in_or_sp.indexOf(title)],
			left: 'center'
		},
		color: ["#37A2DA", "#32C5E9", "#67E0E3", "#91F2DE", "#FFDB5C", "#FF9F7F", "#FF0000", "#6C6C6C", "#02C874", "#02C874", "#A8FF24", "#009393"],
		series: [{
			label: {
				normal: {
					fontSize: 14
				}
			},
			type: 'pie',
			center: ['50%', '50%'],
			radius: ['40%', '60%'],
			data: frequency
		}]
	};
	chart.setOption(option2);
}


Page({

  /**
   * 页面的初始数据
   */
  data: {
    ec2: {
			lazyLoad: true
    },
    ec: {
			lazyLoad: true
		},
    frequency: [ {
      value: 335,
      name: '交通'
    },
    {
      value: 234,
      name: '娱乐'
    },
    {
      value: 1548,
      name: '医疗'
    }],
    income_or_spending: "spending",
    spending: 0,
    accounts: [
      {
       class:"交通",
        money:-10,
        note:"交通",
        date:"2024-9-12"
      } ,
      {
       class:"娱乐",
       money:-10,
       note:"娱乐",
       date:"2024-9-12"
     } 
     ],
    income: 0,
    // 日
    xLine: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31],
    //每日的钱
    yLine: [1,2,3,4,67,20],
  },



	getSecondOption: function () {
		// this.setData({
    //   frequency: ,
    // })
    this.init_second(this.data.frequency)
	},

	//初始化饼图
init_second: function (data) {
  this.secondComponent = this.selectComponent('#mychart2')
  this.secondComponent.init((canvas, width, height, dpr) => {
    const chart2 = echarts.init(canvas, null, {
      width: width,
      height: height,
      devicePixelRatio: dpr
    });
    setSecondOption(chart2, data, this.data.income_or_spending) //赋值给echart图表
    this.chart2 = chart2;
    return chart2;
  });
},
	//初始化柱状图
	init_first: function (xdata, yline) {
		this.firstComponent = this.selectComponent('#mychart1')
		this.firstComponent.init((canvas, width, height, dpr) => {
			const chart1 = echarts.init(canvas, null, {
				width: width,
				height: height,
				devicePixelRatio: dpr
			});
			setFirstOption(chart1, xdata, yline, this.data.income_or_spending) //赋值给echart图表
			this.chart1 = chart1;
			return chart1;
		});
  },
  getFirstOption: function () {
		// this.getDaily(app.globalData.userID, this.data.date, this.data.income_or_spending).then((result) => {
		// 	//console.log(result)
		// 	this.setData({
		// 		yLine: result,
		// 	})
		// 	this.init_first(this.data.xLine, this.data.yLine)
    // })
    this.init_first(this.data.xLine, this.data.yLine)
	},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.getSecondOption()
    this.getFirstOption()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})